/******************************************************************************
* File description: SettingRestore.qml
* Function: 设置-实验恢复
* Current Version: 1.0.0
* Author: 张宇轩
* Date: 2024-08-30
*  -----
*  Copyright by 博坤生物 .
 *****************************************************************************/
import QtQuick 2.14
import QtQuick.Controls 2.14
import QtQuick.Layouts 1.14
import QtGraphicalEffects 1.14

Item {
    id: root

    /* property 定义开始 */
    // 信号
    signal settingReturnSig()
    /* property 定义结束 */

    // 顶部导航栏
    TabbarNav {
        id: tabNav
        width: parent.width
        isEnable: true
        title: "实验恢复"

        onReturnSig: {
            root.settingReturnSig()
            console.log("tabbar nav")
        }
        z: 999
    }

    ColumnLayout {
        anchors.fill: parent
        spacing: 0

        // 主体部分
        Rectangle {
            id: mainPart
            Layout.fillWidth: true
            Layout.preferredHeight: parent.height - btnContainer.height
            Layout.alignment: Qt.AlignTop

            // 背景
            Rectangle {
                anchors.fill: parent
                LinearGradient {
                    anchors.fill: parent
                    start: Qt.point(0, 0)
                    end: Qt.point(0, height)
                    gradient: Gradient {
                        GradientStop {position: 0.0; color: "#007BD8"}
                        GradientStop {position: 1.0; color: "#001A5A"}
                    }
                }
            }

            // 内容
            Rectangle {
                id: contentCon
                width: 600
                height: 330
                radius: 12
                color: "#C3FFFFFF"
                anchors.centerIn: parent

                ColumnLayout {
                    anchors.fill: parent
                    anchors.leftMargin: 40
                    anchors.rightMargin: 40
                    anchors.topMargin: 60
                    spacing: 25

                    // 实验名称
                    LabelComboBox {
                        id: expNameComboBox
                        Layout.fillWidth: true
                        Layout.preferredHeight: 40
                        Layout.leftMargin: 62
                        Layout.rightMargin: 128

                        comboBoxWidth: width
                        comboBoxHeight: height
                        showListMaxCountinPage: 5
                        model: ["20240102100101"]
                        comboBoxText: "实验名称"
                    }

                    Item {
                        Layout.fillWidth: true
                        Layout.preferredHeight: 40
                        Layout.leftMargin: 62
                        Layout.rightMargin: 128

                        // 恢复进度
                        RowLayout {
                            anchors.fill: parent
                            spacing: 8

                            Label {
                                font.pixelSize: 16
                                color: "#FF222222"
                                text: "恢复进度"
                            }

                            // 进度条
                            ProgressBar {
                                id: progressBar
                                Layout.fillWidth: true
                                Layout.preferredHeight: 14
                                value: 0.8

                                background: Rectangle {
                                    implicitWidth: progressBar.width
                                    implicitHeight: progressBar.height
                                    color: "#FFBBBBBB"
                                    radius: 7
                                }

                                contentItem: Item {
                                    Rectangle {
                                        width: progressBar.visualPosition * progressBar.width
                                        height: progressBar.height
                                        border.width: 2
                                        border.color: "#FF2C7333"
                                        color: "#FF51C45C"
                                        radius: 7
                                    }
                                }

                                // 文字
                                // 0%
                                Label {
                                    anchors.left: progressBar.left
                                    anchors.top: progressBar.bottom
                                    font.pixelSize: 14
                                    color: "#FF222222"
                                    text: "0"
                                }

                                // 100%
                                Label {
                                    anchors.right: progressBar.right
                                    anchors.top: progressBar.bottom
                                    font.pixelSize: 14
                                    color: "#FF222222"
                                    text: "100%"
                                }

                                // 普通进度
                                Label {
                                    id: curProgressValue
                                    anchors.left: progressBar.left
                                    anchors.leftMargin:
                                        progressBar.visualPosition * progressBar.width -
                                        curProgressValue.implicitWidth
                                    anchors.top: progressBar.bottom
                                    font.pixelSize: 14
                                    color: "#FF222222"
                                    text: String(parseInt(progressBar.visualPosition*100)) + "%"
                                }
                            }
                        }
                    }

                    CustomVerSpacerItem {}
                }
            }
        }

        // 按钮部分
        Rectangle {
            id: btnContainer
            Layout.fillWidth: true
            Layout.preferredHeight: 80

            RowLayout {
                anchors.fill: parent
                anchors.rightMargin: 16
                anchors.leftMargin: 16

                // 分析
                PureButton {
                    id: analysisBtn
                    pureText: "分析(A)"
                    Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
                }

                CustomHorSpacerItem {}

                // 取消恢复
                PureButton {
                    id: canceledBtn
                    pureText: "取消恢复(C)"
                    Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
                }

                // 开始恢复
                GradientButton {
                    id: startedBtn
                    gradText: "开始恢复(R)"
                    Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
                }
            }
        }
    }
}
